<template>
    <!-- 官网https://animate.style/ -->
    <div class="anima">
        <button type="button" @click="isShow = !isShow">TOGGLE</button>
        <transition>
            <h1 v-show="isShow" class="animate__animated" :class="isShow ? 'animate__backInDown' : 'animate__backInUp'">Hello,
                world</h1>
        </transition>
    </div>
</template>

<script>
import 'animate.css'
export default {
    data() {
        return {
            isShow: true
        };
    }
}
</script>

<style lang="less" scoped></style>